The Wizard helps you define the following properties and values:
Left side of the window |
List of properties of a CSS element, the attributes of an element as well as the expression of the value of the attribute. This list is presented in the form of a tree: the + plus sign indicates that there is a sub-list available.
The name that identifies the right side of the window displays the property or value chosen. |
Upper right corner of the window |
This area is modified according to the main property selected in the left side of the window. They type of input field (input text field, drop-down list, single choice drop-down list) indicates the type of information you should enter here. When you have finished defining the style, brackets appear around the property or the selected value in the left side of the window. |
Selector |
Style rules are made up of a selector and a statement. The selector represents the element (tag, class, ID, pseudo-element) on which the defined styles will be applied. When a tag is selected in the HTML tag area, it is automatically displayed as a selector. |
Class name |
The CLASS selector allows applying the same styles to many HTML tags at the same time. And conversely, many styles can be applied to the same tag. The CLASS selector is very useful to group HTML tags that have similar properties. In this way you can easily modify the statement for a class thereby modifying all the styles of tags it groups. |
HTML tag |
The drop-down list is used to access HTML tags that can be used as selectors. The style definition is applied only to the chosen HTML tag. It is also possible to combine an HTML tag and a class at the same in order to apply more than one style definition for the selected tag. |
Pseudo-element |
The CSS1 norm allows two types of pseudo-elements: first-line and first-letter. These correspond to usual typographic effects you see everywhere. First-line is used to modify the style of the first line of a paragraph, while first-letter is used to change the appearance of the first letter in a sentence. |
ID Selector |
Contrary to the CLASS selector, the ID selector is only applied to one element only. It is used as an identifying element. In other words, all elements can use an ID selector, as long as the name of each one is different from the others. |
Reset |
When you click on this button, all the styles displayed are reset to their initial values, and the properties that you defined are erased. |
Comments |
Here you can type text to describe the use that you want to give to a certain style. This information might be useful in case different people are working on the same pages. |
Once you quit the Wizard, you are returned to the main window of the module that allows you to design your own styles. The styles that you created are displayed in the list.